<template>
<view>
	<view class="top">
		<view class="title">
			个人中心
		</view>
		<image class="img" :src="vuex_headimg || 'http://tou-file.oss-cn-hangzhou.aliyuncs.com/icons/28.png'" ></image>
		<view v-if="vuex_nickname" class="name">
		{{vuex_nickname || ''}}
		</view>
		<view @click="register" v-else class="name">
			点击注册
		</view>
	</view>
	<view class="icons">
		<view class="iconwrap">
			<view @click="navTo('/pages/scan/collectInfo',1)" class="item">
				<image class="img" src="https://file.roumeiji.com/img/26.png" ></image>
				<view>完善信息</view>
			</view>
			<view @click="navTo('/pages/mine/detail',1)" class="item">
				<image class="img" src="https://file.roumeiji.com/img/21.png" ></image>
				<view>扫码记录</view>
			</view>
			<view @click="show=true;flag=1" class="item">
				<image class="img" src="https://file.roumeiji.com/img/22.png" ></image>
				<view>关注公众号</view>
			</view>
		</view>
		<view class="iconwrap">
			<view @click="show=true;flag=2" class="item">
				<image class="img" src="https://file.roumeiji.com/img/23.png" ></image>
				<view>我的客服</view>
			</view>
			<view @click="call" class="item">
				<image class="img" src="https://file.roumeiji.com/img/24.png" ></image>
				<view>联系我们</view>
			</view>
			<!-- @click="navTo('/pages/register/index',2)" -->
			<view   class="item">
				<image class="img" src="https://file.roumeiji.com/img/25.png" ></image>
				<view>地址管理</view>
			</view>
		</view>
	</view>
	
	<!--  -->
	
	<u-modal :show-title="false" :show-confirm-button="false" v-model="show">
			<view class="slot-content">
				
				<u-icon @click="show =false" class="close" name="close"></u-icon>
				<image :show-menu-by-longpress="true" v-if="flag==1" src="../../static/common/img/gzh.jpg" mode=""></image>
				<image :show-menu-by-longpress="true" v-else src="../../static/common/img/qywx.jpg" mode=""></image>
			</view>
		</u-modal>
</view>
</template>

<script>
	export default{
		// props:['info'],
		data(){
			return{
				flag:1,
				show:false
			}
		},
		
		methods:{
			register(){
				uni.navigateTo({
					url:"/pages/register/index"
				})
			},
			navTo(url,type) {
				
				if(type==1){
					if(this.vuex_phone){
						uni.navigateTo({
							url: url,
						});
					}else{
						uni.navigateTo({
							url:"/pages/register/index"
						})
					}
					
				}else if(type==2){
					uni.navigateTo({
						url: url,
					});
				}else{
					uni.navigateTo({
						url: url,
					});
				}
				
				
				
			
			},
			call(){
				uni.makePhoneCall({
					phoneNumber: '4006798893' //仅为示例
				});

			}
		}
	}
</script>
<style>
	page {
		background: #f4f4f4;
	}
</style>
<style scoped lang="scss">
	.close{
		position: absolute;
		top: 15px;
		right: 15px;
		color: #999;
	}
	.slot-content{
		// position: relative;
	}
	.slot-content image{
		width:220px;
		height: 220px;
		margin:32px auto 30px;
		display: block;
	}
	
	.icons{
		background: #FFFFFF;
		border-radius: 10rpx;
		margin: -94rpx 26rpx 0;
		padding: 0 47rpx;
	
		.iconwrap{
			width: 100%;
			display: flex;
			flex-wrap: wrap;
			border-bottom: 1px solid #EEEEEE;
		}
		
		.item{
			width: 33.33%;
			display: flex;
			align-items: center;
			justify-content: center;
			flex-direction: column;
			padding: 74rpx 0 82rpx 0;
			image{
				width: 70rpx;
				height: 70rpx;
			}
			>view{
			
				font-size: 28rpx;
				font-family: Source Han Sans CN;
				font-weight: 500;
				color: #1A1A1A;
				margin-top: 16rpx;
				line-height: 1;
			}
		}
	}
	
	.top{
		width: 100%;
		height: 521.7rpx;
		background: url('https://file.roumeiji.com/img/20.png') no-repeat;
		background-size: cover;
		.title{
			padding-top:114rpx;
			font-size: 32rpx;
			font-family: Source Han Sans CN;
			font-weight: 500;
			color: #FFFFFF;
			text-align: center;
		}
		.img{
			margin: 64rpx auto 24rpx;
			width: 120rpx;
			height: 120rpx;
			border-radius: 50%;
			display: block;
		}
		.name{
			
			text-align: center;
			line-height: 1;
			font-size: 32rpx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: #FFFFFF;
		
		}
	}
</style>